<script>
export default {
  name: 'RatioBar',
  functional: true,
  props: {
    pass: {
      type: Number,
      required: true
    },
    fail: {
      type: Number,
      required: true
    }
  },
  render(h, context) {
    const { pass, fail } = context.props
    const total = pass + fail
    const ratio = total > 0 ? (pass / total) : 0
    return h('mu-linear-progress', {
      props: {
        mode: 'determinate',
        color: 'green',
        size: 15,
        value: parseInt(ratio * 100)
      }
    })
  }
}
</script>
